<template>
    <div>
        <van-row style="margin-top: 1rem;"> 
            <van-col span="2" >
                <van-icon name="arrow-left" @click="exit" />
            </van-col>
            
        </van-row>
        <van-row style="margin-bottom: 3rem;">
            <van-col span="6">
                &nbsp;
            </van-col>
            <van-col span="12">
                忘记密码
            </van-col>
            <van-col span="6">
                &nbsp;
            </van-col>
        </van-row>
        <van-row>
            <van-col span="24">
                <van-form @submit="onSubmit">
                    <van-field
                        v-model="username"
                        name="username"
                        label="账号"
                        placeholder="账号"
                        :rules="[{ required: true, message: '请填写账号' }]"

                    />
                    <van-field
                        v-model="password"
                        type="password"
                        name="password"
                        label="新密码"
                        placeholder="新密码"
                        :rules="[{ required: true, message: '请填写新密码' }]"
                    />
                    <van-field
                        v-model="email"
                        type="username"
                        name="email"
                        label="邮箱地址"
                        placeholder="邮箱地址"
                        :rules="[{ required: true, message: '请填写邮箱' }]"
                    />
                    <van-field
                        v-model="sms"
                        name="sms"
                        center
                        clearable
                        label="邮箱验证码"
                        placeholder="请输入邮箱验证码"
                        >
                        <template #button>
                            <van-button size="small" type="primary" @click="sendEmail()">发送验证码</van-button>
                        </template>
                    </van-field>
                    <div style="margin: 16px;">
                        <van-button round block type="info" native-type="submit">提交</van-button>
                    </div>
                    </van-form>
            </van-col>
        </van-row>
    </div>
</template>

<script>
    import { Toast } from 'vant';
    import {repassword,forgetpass} from '@/api/index'
    export default {
        data() {
            return {
                username: '',
                password: '',
                email:'',
                sms:'',
                code:'1111',
            };
  },
  methods: {
    onSubmit(values) {
       if(this.sms!=""  ){
            if(this.code!=this.sms){
                Toast("验证码错误,有效时间30s")

            }
            else 
                repassword(values).then(res=>{
                    if(res.data)
                    {
                        Toast("修改成功")
                        this.$router.push("/")
                    }else
                        Toast("修改失败")
                })
       } 
        
   
      
        
    },
    exit(){
        this.$router.push('/my')
    },
    // setUserName(){
    //     this.username=localStorage.getItem('username')
    // }
    sendEmail(){
        let isemail=true
        //验证邮箱格式

        if(this.email.indexOf("@",0)==-1){
            isemail=false
        }
        if(this.email.indexOf(".",0)==-1){
            isemail=false
        }
            
        if(isemail){//邮箱格式正确
            let userinfo={}
            let ver
            userinfo["username"]=this.username
            userinfo["email"]=this.email
            forgetpass(userinfo).then(res=>{
                this.code=res.data.data
                ver=this.code
            })
            setTimeout(()=>{
                this.code=""
                ver=""
            },30000)
             Toast("已发送,请看邮箱")
        }else{
            Toast("邮箱格式不正确")
        }



        
    },

  },
  mounted(){
    // this.setUserName()
  }
};
</script>